<template>
  <div>

    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="1">作业管理</el-menu-item>
      <el-menu-item index="2"@click="jump">文件管理</el-menu-item>
    </el-menu>
    <div class="line"></div>


    <el-card style="padding: 10px">

      <el-form :model="queryParams">
        <el-input
          style="width: 240px"
          v-model="queryParams.teacherId"
          placeholder="请输入教师id"
        />
        <el-button >查   询</el-button>
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
        >导出
        </el-button>
      </el-form>
      <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        >
        <el-table-column label="id" align="center" prop="id" width="150px" v-if="false"/>
        <!--        <el-table-column label="进行中"></el-table-column>-->
        <el-table-column label="作业名" align="center" prop="title" />
        <el-table-column label="开始时间" align="center" prop="startTime"/>
        <el-table-column label="结束时间" align="center" prop="endTime" />
        <el-table-column label="创建者" align="center" prop="creator" />
        <el-table-column label="操作" width="200px">
          <template slot-scope="scope">
            <el-button type="primary" size="mini" @click="QuestionDetail(scope.row)">查  看</el-button>



          </template>
        </el-table-column>
      </el-table>

      <el-table
        ref="multipleTable"
        :data="tableData1"
        tooltip-effect="dark"
        style="width: 100%"
        >
        <el-table-column align="center" prop="id" width="150px" v-if="false"/>
        <!--        <el-table-column label="进行中"></el-table-column>-->
        <el-table-column align="center" prop="title" />
        <el-table-column align="center" prop="startTime"/>
        <el-table-column align="center" prop="endTime" />
        <el-table-column align="center" prop="creator" />
        <el-table-column  width="200px">
          <template slot-scope="scope">
            <el-button type="primary" size="mini" @click="QuestionDetail(scope.row)">未开始</el-button>
            <!--            <el-button type="info" size="mini" disabled >未开始</el-button>-->
          </template>
        </el-table-column>
      </el-table>

      <el-table
        ref="multipleTable"
        :data="tableData2"
        tooltip-effect="dark"
        style="width: 100%"
        >
        <el-table-column align="center" prop="id" width="150px" v-if="false"/>
        <!--        <el-table-column label="进行中"></el-table-column>-->
        <el-table-column align="center" prop="title" />
        <el-table-column align="center" prop="startTime"/>
        <el-table-column align="center" prop="endTime" />
        <el-table-column align="center" prop="creator" />
        <el-table-column  width="200px">
          <template slot-scope="scope">
            <el-button type="primary" size="mini" @click="QuestionDetail(scope.row)">已过期</el-button>
<!--            <el-button type="info" size="mini" disabled >已过期</el-button>-->
          </template>
        </el-table-column>
      </el-table>


    </el-card>



  </div>

</template>

<script>
  import { queryQuestionList} from "@/api/teacher/detail/course/detail";
  import {Now,After,Before} from "@/api/student/topic"
  import { queryProblemByTopicId,eidtProblem,queryProblemById,DeleteProblem,queryByTopicId} from "@/api/teacher/addTopic";
  import { getUserProfile } from "@/api/system/user";
  import { queryCourseList,saveTopic,queryCourseListByCreator,queryCourseListByTitle,saveProblem,queryByTopic} from "@/api/teacher/detail/course/QuestionBank";
  export default {

    name: "topic",

    created() {
      this.getUser();
    },
    data(){
      return {

        form:{},
        form1:{},
        activeIndex: '1',
        activeIndex2: '1',
        queryParams: {
          pageNum: undefined,
          pageSize: undefined,
          teacherId: null,
        },
        user: {},
        tableData: [],
        tableData1: [],
        tableData2: [],
        data1:null
      }
    },
    methods: {

      getUser() {
        this.classId = this.$route.query.classId//创建作业后传过来title

        Now(this.classId).then(response => {
          this.tableData = response
        })
        Before(this.classId).then(response => {
          this.tableData1 = response
        })
        After(this.classId).then(response => {
          this.tableData2 = response
        })
      },
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },

      handleExport(){
        this.download('/teacher/xlsF', {
          ...this.classId
        }, `info_${new Date().getTime()}.xlsx`)
      },
      QuestionDetail(row){
        this.$router.push({ path: 'TopicDetail', query: { id: row.id }})
      },
      jump(){
        this.$router.push('teacher/FileBank')
      },
    }
  }
</script>

<style scoped>

</style>
